 <script type="text/javascript">
 var timer=0;
		$(function() {
		$( "#dropdown" ).mouseenter(function(){
			clearTimeout(timer);
			//alert(timer);
			$("#dropdownmenu").slideDown(200);
		});
		$("#dropdown").mouseleave(function(){
			timer = setTimeout(function(){$("#dropdownmenu").slideUp(200);},500);
		});
	});
	</script>
<div class="container" style="height:55px;">
				<a id="logo" href="#">UniversityXP</a>
				<div class="seperate"></div>
				<div id="menu">
					<ul>
						<li>
							<a href="../index.html">HOME</a> 
						</li>
						<li id="dropdown">
							<a href="#" id="channel">CHANNEL</a> 
							<ul id="dropdownmenu" style="display: none;">
								<li><a href="">MARKET LIST</a></li>
								<li><a href="">ACTIVITIES</a></li>
								<li><a href="list.html">DINING</a></li>
								<li><a href="">GRADE YOUR COURSE</a></li>
								<li><a href="">COLLEGE HARMONY</a></li>
								
							</ul>
						</li>
					</ul>
				</div>
				<div class="ucenter">
						<span class="uleft"></span>
						<div class="ucbody">Welcome Jason | <a href="uc_index.html">user center</a> | <a href="#">log out</a></div>
						<span class="uright"></span>
					</div>
					</div>
					<div class="container">
			<div class="banner">
				<div class="usermenu">
					<ul>
						<li><a href="uc_index.html">Index</a></li>
						<li><a href="uc_msg.html">Messages(<em>3</em>)</a></li>
						<li><a href="uc_mark.html" class="selected">Marks</a></li>
						<li><a href="uc_fav.html">Favorite</a></li>
						<li><a href="uc_active.html">Activities</a></li>
						<li><a href="uc_pi.html">Personal info</a></li>
						
					</ul>
				</div>
			</div>
			</div>